<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <link href="../../assets/lib/layui/css/layui.css" rel="stylesheet" />
    <link href="../../assets/lib/winui/css/winui.css" rel="stylesheet" />
</head>
<body style="background-color: rgb(242, 242, 242);">
    <div class="layui-fluid">
        <form class="layui-form layui-form-pane layui-col-xs12" action="">
            <div class="layui-form-item  margin-top-10 layui-col-space15" style="background-color: white;">
                <div class="layui-inline" style="margin-bottom: 0px">
                    <label class="layui-form-label">区域</label>
                    <div class="layui-input-inline">
                        <select id="areaId" name="areaId" lay-filter="areaId" lay-search="">

                        </select>
                    </div>
                    <label class="layui-form-label">门店</label>
                    <div class="layui-input-inline">
                        <select id="storeId" name="storeId" lay-filter="storeId" lay-search="">

                        </select>
                    </div>
                    <label class="layui-form-label">性质</label>
                    <div class="layui-input-inline">
                        <select id="natureId" name="natureId" lay-filter="natureId" lay-search="">
                        </select>
                    </div>
                    <label class="layui-form-label">日期范围</label>
                    <div class="layui-input-inline">
                        <input type="text" id="createTime" name="createTime" placeholder="请选择日期范围" class="layui-input" />
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 margin-top-10 layui-col-space15">

                <div class="layui-col-sm6 layui-col-md3">
                    <div class="layui-card">
                        <div class="layui-card-header">
                            会员量
                        </div>
                        <div class="layui-card-body layuiadmin-card-list">
                            <p class="layuiadmin-big-font" id="mealOrderMemberByNum">0个</p>
                            <p>已支付的套餐订单购买会员数。</p>
                        </div>
                    </div>
                </div>

                <div class="layui-col-sm6 layui-col-md3">
                    <div class="layui-card">
                        <div class="layui-card-header">
                            保养套餐销售量
                        </div>
                        <div class="layui-card-body layuiadmin-card-list">
                            <p class="layuiadmin-big-font" id="mealOrderNum">0单</p>
                            <p>已支付的套餐订单数。</p>
                        </div>
                    </div>
                </div>

                <div class="layui-col-sm6 layui-col-md3">
                    <div class="layui-card">
                        <div class="layui-card-header">
                            保养量
                        </div>
                        <div class="layui-card-body layuiadmin-card-list">
                            <p class="layuiadmin-big-font" id="keepFitOrderNum">0单</p>
                            <p>已支付/保养完成/已核销保养订单的数量。</p>
                        </div>
                    </div>
                </div>

                <div class="layui-col-sm6 layui-col-md3">
                    <div class="layui-card">
                        <div class="layui-card-header">
                            保养金额
                        </div>
                        <div class="layui-card-body layuiadmin-card-list">
                            <p class="layuiadmin-big-font" id="keepFitOrderPrice">0.00元</p>
                            <p>已支付/保养完成/已核销保养订单的总金额。</p>
                        </div>
                    </div>
                </div>

                <div class="layui-col-xs6">
                    <div class="layui-card">
                        <div class="layui-card-header">保养套餐销售比对</div>
                        <div class="layui-card-body">
                            <div id="echart1" class="layui-row" style="height: 400px;">

                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-col-xs6">
                    <div class="layui-card">
                        <div class="layui-card-header">保养对比</div>
                        <div class="layui-card-body">
                            <div id="echart2" class="layui-row" style="height: 400px;">

                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-col-xs4">
                    <div class="layui-card">
                        <div class="layui-card-header">保养套餐销售门店比例</div>
                        <div class="layui-card-body">
                            <div id="echart3" class="layui-row" style="height: 400px;">

                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-col-xs4">
                    <div class="layui-card">
                        <div class="layui-card-header">保养门店比例</div>
                        <div class="layui-card-body">
                            <div id="echart4" class="layui-row" style="height: 400px;">

                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-col-xs4">
                    <div class="layui-card">
                        <div class="layui-card-header">订单性质比例</div>
                        <div class="layui-card-body">
                            <div id="echart5" class="layui-row" style="height: 400px;">

                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </form>
    </div>

    <script type="text/x-handlebars-template" id="selectTemplate">
        <option value="">全部</option>
        <option value="-">默认区域</option>
        {{#each rows}}
        <option value="{{id}}">{{name}}</option>
        {{/each}}
    </script>

    <script src="../../assets/lib/layui/layui.js"></script>
    <script src="../../assets/lib/layui/custom.js"></script>
    <script type="text/javascript">
        layui.config({base: '../../js/statistics/'}).use('statistics');
    </script>
</body>
</html>